var descs = new Array("Model","Wbudowany układ graficzny","Częstotliwoś rdzenia","Liczba jednostek cieniujących","Zegar jednostek cieniujących","Obsługa DirectX","Shader Model","Liczba portów USB 2.0","Liczba portów SATA II","Liczba portów SATA 6 GB/s","Obsługa RAID","Liczba portów IDE","Hybrid SLI / CrossFire","Standard HDMI","Proces technologiczny");
var heigh = new Array(1,1,1,1,1,1,1,1,1,1,1,1,1,1,1);
var cards = new Array(new Array("AMD 890GX","Radeon HD 4290","700 MHz","40","700 MHz","10.1","4.1","14","b/d","6","0, 1, 10, 5","1 (dwa urządzenia)","ATI Hybrid CrossFireX","1.3","55 nm"),
new Array("AMD 790GX","Radeon HD 3300","700 MHz","40","700 MHz","10","4.0","14","6","brak","0, 1, 10, 5","1 (dwa urządzenia)","ATI Hybrid CrossFireX","1.2","55 nm"),
new Array("AMD 785G","Radeon HD 4200","500 MHz","40","500 MHz","10.1","4.1","14","6","brak","0, 1, 10, 5","1 (dwa urządzenia)","ATI Hybrid CrossFireX","1.3","55 nm"),
new Array("NVIDIA GeForce 9300","GeForce 9300 mGPU","450 MHz","16","1200 MHz","10","4.0","12","5","b/d","0, 1, 10, 5","1 (dwa urządzenia)","GeForce Boost","b/d","65 nm"),
new Array("Intel G45","GMA X4500","800 MHz","10","800 MHz","10","4.0","12","6","brak","0, 1, 10, 5 (z ICH 10R)","brak","nie","b/d","65 nm"));
var pos = 0;
var ie=document.all;
var myWidth = 0, myHeight = 0;
var scroll = 0;
var elemMin = 9;
var elemTotal = 0;
var elemVisible = 14;
var scrollStep = 19;
var scrollMax = elemTotal-elemVisible;
var time, theTime, amount;
var nowX, nowY;
var offsetx = 0, offsety = 0;
var dragEnabled = false;
var elem;
var pare;
var adding = false;
var changing = -1;
var cardList = new Array();
var configCardWidth = 185;
var configScrollWidth = 17;
var configScrollArrowHeight = 16;
var configScrollBarHeight = 52;
var configScrollMargin = 4;
var configTableMargin = 10;
var configTableType = 0;
var configTableId = 40;
var configTableAmount = 2;
var configTableList = new Array();

function getMySize() 
{
	if( typeof( window.innerWidth ) == 'number' ) 
	{
		//Non-IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} 
	else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) 
	{
		//IE 6+ in 'standards compliant mode'
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
	} 
	else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) 
	{
		//IE 4 compatible
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
	}
}

function addCardList(id)
{
	cardList[cardList.length] = id;
}

function delCardList(pos)
{
	var newList = new Array();
	for (var i = 0; i < pos; i++)
	{
		newList[newList.length] = cardList[i];
	}
	
	for (var i = pos+1; i < cardList.length; i++)
	{
		newList[newList.length] = cardList[i];
	}
	cardList = newList;
}

function changeCardList(pos, id)
{
	var newList = new Array();
	for (var i = 0; i < pos; i++)
	{
		newList[newList.length] = cardList[i];
	}
	newList[pos] = id;
	for (var i = pos+1; i < cardList.length; i++)
	{
		newList[newList.length] = cardList[i];
	}
	cardList = newList;
}


function dragInit(e)
{
  elem = ie ? event.srcElement : e.target;
  if (elem != null)
  {
	if (elem.id == "tgo")
	{
		pare = ie ? elem.parentElement : elem.parentNode;
		offsetx = ie ? event.clientX : e.clientX;
	    offsety = ie ? event.clientY : e.clientY;
		var z = findPos(elem);
		var v = findPos(pare);
	    //nowX = parseInt(z[0]);
	    //nowY = parseInt(z[1]);
	    nowX = parseInt(elem.offsetLeft);
	    nowY = parseInt(z[1]-v[1]);
	    dragEnabled = true;
	    document.onmousemove = doDrag;
    }
  }
}

function doDrag(e){
  if (!dragEnabled)
  {
    return;
  }
  //elem.style.left= (ie ? nowX+event.clientX-offsetx : nowX+e.clientX-offsetx) + "px";
  var margin = ie ? event.clientY-offsety+nowY : e.clientY-offsety+nowY;
  moveScroll(margin);
  
  scroll = parseInt(margin / ((pare.offsetHeight-elem.offsetHeight+1) / (elemTotal-elemVisible+1)));
  moveData();
  
  return false;
}

function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return [curleft,curtop];
}

function init()
{
	if (/*(configTableId == 1 || 
		 configTableId == 2 || 
		 configTableId == 3 || 
		 configTableId == 4) && */configTableType)
		addAll();
	else
	{
		if (configTableList.length > 0)
		{
			for (var i = 0; i < configTableList.length; i++)
				addCardList(configTableList[i]);			
		}
		else
		{
			if (configTableAmount > cards.length)
				configTableAmount = cards.length;
			for (var i = 0; i < configTableAmount; i++)
			{
				var nCol = 0;
				do {
					nCol = parseInt(random()*cards.length);
				}
				while(isThere(nCol, cardList));
				addCardList(nCol);
			}
		}
	}
	getMySize();
	getHeight();
	showData();
	showHeader();
	showDesc();
	addWheelSupport();
	showCards();
	if (elemTotal > elemVisible)
		showScroll();
	document.onmousedown = dragInit;
	document.onmouseup = Function("dragEnabled=false");
	moveData();
	if (configTableType)
	{
		fixHeight();
		window.onresize = fixHeight;
	}
}

function isThere(what, where)
{
	for (var i = 0; i < where.length; i++)
		if (where[i] == what)	
			return true;		
	return false;
}

function getHeight()
{
	for (var i = 1; i < heigh.length; i++) 
	{	
		elemTotal += heigh[i];
	}
}

function fixHeight()
{
	getMySize();
	var content = document.getElementById("tcontent");
	var scr = document.getElementById("tscroll");
	var bar = document.getElementById("tbar");
	var go = document.getElementById("tgo");	
	
	var contentBottom = content.offsetTop + content.offsetHeight;
	var diff = myHeight - contentBottom - (3 * configTableMargin);

	if (diff != 0)
	{
		elemVisible += parseInt(diff/scrollStep);

		if (elemVisible > elemTotal)
			elemVisible = elemTotal;
		if (elemVisible < elemMin)
			elemVisible = elemMin;
	}
	content.style.height = scrollStep * elemVisible + "px";
	if (scroll > elemTotal - elemVisible)
	{
		scroll = elemTotal - elemVisible;
		content.scrollTop = scrollStep*scroll;
	}
	if (elemVisible == elemTotal)
		scr.style.display = "none";	
	else	
	{
		scr.style.display = "inline";	
		var barHeight = scrollStep * elemVisible - (2 * configScrollArrowHeight);
		bar.style.height = barHeight + "px";		
		var span = bar.offsetHeight - go.offsetHeight;
		var goMargin = parseInt((span/(elemTotal-elemVisible)) * scroll);
		if (goMargin > span)
			goMargin = span;
		go.style.marginTop = goMargin + "px"
	}
}

function addWheelSupport()
{
	var content = document.getElementById("tcontent");
	if (content.addEventListener) //window
        content.addEventListener('DOMMouseScroll', wheel, false); //window
	content.onmousewheel = wheel; //window & document
}

function showData()
{
	document.write("<div id=\"tdata\"></div><div id=\"tselect\"></div>");
	var h = document.getElementById("tdata");
	str = "<div id=\"theader\"><div id=\"thdesc\"></div><div id=\"thcards\"></div></div>";
	str += "<div id=\"tcontent\"><div id=\"tdesc\"></div><div id=\"tcards\"></div></div>";
	str += "<div id=\"tscroll\"></div>";
	h.innerHTML = str;	
}

function addCard()
{
	var h = document.getElementById("tselect");
	if (adding == true)
	{
		h.style.display = "none";
		adding = false;
		return;
	}
	adding = true;

	var e = document.getElementById("thdesc0");
	var rightSide = e.offsetLeft + e.offsetWidth;
	var bottomSide = e.offsetTop + e.offsetHeight;

	showSelect();
	var listWidth = h.offsetWidth;
	h.style.left = rightSide - listWidth + "px";
	h.style.top = bottomSide + "px";
	var z = document.getElementById("tselectdata");	
	for (var i = 0; i < z.length; i++) 
	{
		z.options[i].selected = false;
	}
	z.onclick = function() {
		var h = document.getElementById("tselect");
		h.style.display = "none";
		addCardList(this.value);
		showCards();
		adding = false;
	};
}

function addAll()
{
	cardList = new Array();	
	for (var i = 0; i < cards.length; i++) 
	{
		addCardList(i);
	}
}

function delCard(i)
{
	delCardList(i);
	showCards();
}

function changeCard(pos)
{
	var h = document.getElementById("tselect");
	if (changing == pos)
	{
		h.style.display = "none";
		changing = -1;
		return;
	}
	changing = pos;

	var e = document.getElementById("thcard"+pos);
	var rightSide = e.offsetLeft + e.offsetWidth;
	var bottomSide = e.offsetTop + e.offsetHeight;

	showSelect();
	var listWidth = h.offsetWidth;
	h.style.left = rightSide - listWidth + "px";
	h.style.top = bottomSide + "px";
	var z = document.getElementById("tselectdata");	
	//alert(cardList[pos]);
	for (var i = 0; i < z.length; i++) 
	{
		if (z.options[i].value == cardList[pos])
			z.options[i].selected = true;
	}
	z.onclick = function() {
		var h = document.getElementById("tselect");
		h.style.display = "none";
		changeCardList(pos,this.value);
		showCards();
		changing = -1;
	};
}

function startScroll(name,amt,tim)
{
	amount = amt;
	theTime = tim;
	realscroll();
}

function realscroll()
{
	scroll += amount;
	moveData();
	var bar = document.getElementById("tbar");	
	var go = document.getElementById("tgo");	
	var span = bar.offsetHeight - go.offsetHeight;
	go.style.marginTop = (parseInt((span/(elemTotal-elemVisible)) * scroll)) + "px";
	time = setTimeout('realscroll()',theTime);
}

function stopScroll()
{
	if (time) clearTimeout(time);
}

function moveScroll(margin)
{
  if (margin < 0)
  	margin = 0;
  if (margin > pare.offsetHeight-elem.offsetHeight)
  	margin = pare.offsetHeight-elem.offsetHeight;
  elem.style.marginTop= margin + "px";
}

function moveData()
{
	var content = document.getElementById("tcontent");		
	if (scroll < 0) scroll = 0;
	if (scroll > elemTotal-elemVisible) scroll = elemTotal-elemVisible;
	content.scrollTop = scrollStep*scroll;	
}

function showSelect()
{
	var h = document.getElementById("tselect");
	str = "<select id=\"tselectdata\" size=\"15\" onclick=\"\"></select>";
	h.innerHTML = str;
	var z = document.getElementById("tselectdata");	
	for (var i = 0; i < cards.length; i++) 
	{
		z.length++;
		z.options[z.length-1].value = i;
		z.options[z.length-1].text = cards[i][0];	
	}
	h.style.display = "inline";
}

function showHeader()
{
	var h = document.getElementById("thdesc");
	str = "<div id=\"thdesc0\" class=\"item desc\"><span>&nbsp;" + /*descs[0] +*/ "</span><div class=\"menu\">";
	if (configTableType)
		str += "<a href=\"\" onclick=\"addAll(); showCards(); return false;\"><img src=\"/img/table_showall_button.gif\" width=\"12\" height=\"12\" alt=\"*\" title=\"Pokaż wszystkie\" /></a> <a href=\"\" onclick=\"addCard(); return false;\"><img src=\"/img/table_plus_button.gif\" width=\"12\" height=\"12\" alt=\"v\" title=\"Dodaj kolumnę\" /></a>";
	else
	str += "<a href=\"/script/table.php?a=pop&d=40&c=1|"+ elemVisible +"|" + cardList[0] + "\" target=\"_blank\"><img src=\"/img/table_newwindow_button.gif\" width=\"12\" height=\"12\" alt=\"*\" title=\"Pokaż w nowym oknie\" /></a>";
//		str += "<a href=\"\" onclick=\"newWindow(); return false;\"><img src=\"/img/table_newwindow_button.gif\" width=\"12\" height=\"12\" alt=\"*\" title=\"Pokaż w nowym oknie\" /></a>";
	str += "</div></div>";	
	h.innerHTML = str;
	var div = document.getElementById("thdesc0");
	var span = div.getElementsByTagName("span");
	if (span[0].offsetHeight < 20)
		span[0].style.lineHeight = div.offsetHeight - 5 + "px";
}

function showCards()
{
    var d = document.getElementById("tdata");
    var c = document.getElementById("tcontent");
    var e = document.getElementById("tdesc");
    var h = document.getElementById("tcards");
    var hh = document.getElementById("thcards");
	str = "";
	strH = "";	
	for (var i = 0; i < cardList.length; i++) 
	{
	    strH += "<div id=\"thcard"+i+"\" class=\"item\"><span>" + cards[cardList[i]][0] + "</span><div class=\"menu\">";
		strH += "<a href=\"\" onclick=\"changeCard("+i+"); return false;\"><img src=\"/img/table_down_arrow_button.gif\" width=\"12\" height=\"12\" alt=\"v\" title=\"Zmień produkt\" /></a>";
		if (configTableType)
			strH += " <a href=\"\" onclick=\"delCard("+i+"); return false;\"><img src=\"/img/table_minus_button.gif\" width=\"12\" height=\"12\" alt=\"-\" title=\"Usuń z tabeli\" /></a>";
		strH += "</div></div>";
		str += "<div id=\"tcard"+i+"\" class=\"card\">";
		str += showCard(cardList[i]);
		str += "</div>";
	}
	h.innerHTML = str;
	hh.innerHTML = strH;
	var contentWidth = e.offsetWidth + (cardList.length * configCardWidth);
	c.style.width = contentWidth + "px";
	c.style.height = scrollStep * elemVisible + "px";
	
	var dataWidth = contentWidth + configScrollWidth + configScrollMargin + 3;
	d.style.width = dataWidth + "px";

	for (var i = 0; i < cardList.length; i++) 
	{
		var div = document.getElementById("thcard"+i);
		var span = div.getElementsByTagName("span");
		if (span[0].offsetHeight < 20)
			span[0].style.lineHeight = div.offsetHeight - 5 + "px";
	}
}

function showScroll()
{
	var h = document.getElementById("tscroll");
	str = "";
	str += "<div id=\"tup\" class=\"arrow up\" onmousedown=\"startScroll('content', -1, 50);\" onmouseout=\"stopScroll();\" onblur=\"stopScroll();\" onmouseup=\"stopScroll();\"></div>";
	str += "<div id=\"tbar\"><div id=\"tgo\"></div></div>";
	str += "<div id=\"tdown\" class=\"arrow down\" onmousedown=\"startScroll('content', 1, 50);\" onmouseout=\"stopScroll();\" onblur=\"stopScroll();\" onmouseup=\"stopScroll();\"></div>";

	h.style.width = configScrollWidth + "px"; 
	h.style.paddingLeft = configScrollMargin + "px";
	h.innerHTML = str;

	var h = document.getElementById("tup");
	h.style.height = configScrollArrowHeight + "px";
	
	var h = document.getElementById("tdown");
	h.style.height = configScrollArrowHeight + "px";

	var h = document.getElementById("tgo");
	h.style.height = configScrollBarHeight + "px";

	var barHeight = scrollStep * elemVisible - (2 * configScrollArrowHeight);

	var h = document.getElementById("tbar");
	h.style.height = barHeight + "px";
}

function handleWheel(delta) 
{
    if (delta < 0)
		scroll += 1;
	else
		scroll -= 1;
	moveData();			
	var bar = document.getElementById("tbar");	
	var go = document.getElementById("tgo");	
	if (go == null)
		return;
	var span = bar.offsetHeight - go.offsetHeight;
	go.style.marginTop = (parseInt((span/(elemTotal-elemVisible)) * scroll)) + "px";		
}

function wheel(event)
{
	var delta = 0;
	if (!event)
		event = window.event;

	var topNode = ie ? "BODY" : "HTML";	
	var who = ie ? event.srcElement : event.target;		
	while (who != null && who.id != "tcontent" && who.tagName != topNode)
    	who = ie ? who.parentElement : who.parentNode;
	if (who.id == "tcontent")
	{
		if (event.wheelDelta) 
		{ 
			delta = event.wheelDelta/120;
			if (window.opera)
				delta = -delta;
		} 
		else if (event.detail) 
		{
	    	delta = -event.detail/3;
	    }
	    if (delta)
	    	handleWheel(delta);
	    if (event.preventDefault)
	    	event.preventDefault();
		event.returnValue = false;
	}
}

function newWindow()
{
	var PositionX = 10;
	var PositionY = 10;
	var defaultWidth  = 780;
	var defaultHeight = 540;
	var imgWin = window.open('/script/table.php?a=pop&d=1&c=1|'+ elemVisible +'|' + cardList[0], '','scrollbars=yes,resizable=yes,status=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+PositionY);
}

/************************************ CUSTOM ********************************************/

 
    
function showDesc()
{
	var h = document.getElementById("tdesc");
	str = "";
	for (var i = 1; i < 34; i++) 
	{
	 	isEven=(i%2==0)?" even":"";
		if (heigh[i] == 1)
			hStyle="";
		else 
		 	hStyle="height: "+((heigh[i]*scrollStep)-1)+"px; line-height:"+((heigh[i]*scrollStep)-1)+"px";	 	
		str += "<div class=\"item"+isEven+"\" style=\""+hStyle+"\">" + descs[i] + "</div>";
	}
	h.innerHTML = str;
}

function showCard(num)
{
	str = "";
	for (var i = 1; i < 34; i++) 
	{
		isEven=(i%2==0)?" even":"";
		if (heigh[i] == 1)
			hStyle="";
		else 
		 	hStyle="height: "+((heigh[i]*scrollStep)-1)+"px;";
		str += "<div class=\"item"+isEven+"\" style=\""+hStyle+"\">" + cards[num][i] + "</div>";
	}
	return str;
}


/************************************ CUSTOM ********************************************/

init();